import React from "react";
import ReactDOM from "react-dom";
import { aw, pendingResolve, Throwable } from "@/module-00-codebase/pkg-02-tool";
import { BaseElmt } from "@/module-00-codebase/pkg-03-abstract";
import { Bi, RootContainer } from "@/module-00-codebase/pkg-01-container";
import { consts } from "@/module-00-codebase/pkg-00-const";

export class RootRenderer {}
export const initializing = async () => {
  const primary = pendingResolve<void>();
  const secondary = pendingResolve<void>();
  const rootDom = document.getElementById("root");
  if (!rootDom) {
    Throwable("Impossible Error: No Root DOM.");
  } else {
    await aw(
      ReactDOM.render,
      (
        <>
          <Root params={[]} init={elmt => ((RootContainer.primary = elmt) && primary.resolve()) || Bi.log.info("primary elmt setted.")} />
          <Root params={[]} init={elmt => ((RootContainer.secondary = elmt) && secondary.resolve()) || Bi.log.info("secondary elmt setted.")} />
        </>
      ) as any,
      rootDom
    );
    rootDom.className = Bi.styleRenderer.render({ width: "100%", height: "100%", left: "0", top: "0", margin: 0, padding: 0, position: "fixed", overflowX: "hidden" });
    await Promise.all([primary, secondary]);
  }
};
export const dependencies = () => ["Utils", "Log", "StyleRenderer"];
export const order = () => consts.firstOrder;
class Root extends BaseElmt<[]> {
  public elmtView(): JSX.Element | null {
    return <></>;
  }
}
